<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
           table {
            width: 100%;
            border: 1px solid #ccc;
            border-collapse: collapse;
            border-spacing: 0px;
        }

        table td {
            border: 1px solid #ccc;
            height: 30px;
            width: 100px;
        }
    </style>
</head>
<body>
    行：<input type="text"  id="in1">
    列：<input type="text" id="in2">
<button id="btn">生成表格</button>
    <table id="t"></table>
</body>
<script>
     var btn1=document.getElementsByClassName("btn1")
     var btn2=document.getElementsByClassName("btn2")
    btn.onclick=function(){
        t.innerHTML=""
        var i1=in1.value
        var i2=in2.value
        for(var i=0; i<i1; i++){
            var tr=document.createElement("tr")
            t.appendChild(tr)
            for(var j=0;j<i2; j++){
                var td=document.createElement("td")
                if(j==0){
                    td.innerHTML = i+1
                }
                if(j==i2-1){
                    td.innerHTML=`
                    <button class="btn1">复制</button>
                    <button class="btn2">删除</button>   `

                }
                
                tr.appendChild(td)
            }
        }
    

      

        // 复制事件
       
            for(let i=0;i<btn1.length;i++){
                btn1[i].onclick=function(){
                var res=this.parentElement.parentElement.cloneNode(true)
                t.appendChild(res)
                
            }
            }
       
          // 删除事件
         
            for(let i=0;i<btn2.length;i++){
                btn2[i].onclick=function(){
                this.parentElement.parentElement.remove()
            }
            }
        
    }
   

    
</script>
</html>